/*
容器组件
优化
*/

// 引入Count的UI组件
import CountUI from '../../componets/Count'
// 引入action
import { createIncrementAction, createDiscrementAction, createIncrementAsyncAction } from '../../redux/count_action'
// 引入connect用于连接UI组件与redux
import { connect } from 'react-redux'

// 映射状态
// const mapStateToProps = state => ({ count: state })

// 映射操作状态的方法
// const mapDispatchToProps = dispatch => ({
//     jia: (number) => {
//         //通知redux执行加法 
//         dispatch(createIncrementAction(number))
//     },
//     jian: (number) => {
//         //通知redux执行减法 
//         dispatch(createDiscrementAction(number))
//     },
//     jiaAsync: (number, time) => {
//         //通知redux执行减法 
//         dispatch(createIncrementAsyncAction(number, time))
//     },
// })

// 创建并暴露一个Count的容器组件
// export default connect(mapStateToProps, mapDispatchToProps)(CountUI)
export default connect(
    state => ({ count: state }),

    // mapDispatchToProps 一般写法
    /* dispatch => ({
        jia: (number) => {
            //通知redux执行加法 
            dispatch(createIncrementAction(number))
        },
        jian: (number) => {
            //通知redux执行减法 
            dispatch(createDiscrementAction(number))
        },
        jiaAsync: (number, time) => {
            //通知redux执行减法 
            dispatch(createIncrementAsyncAction(number, time))
        },
    }) */

    // mapDispatchToProps 简写  react-redux只需要写到action,自动dispatch
    {
        jia: createIncrementAction,
        jian: createDiscrementAction,
        jiaAsync: createIncrementAsyncAction,
    }
)(CountUI)












